<template>
  <div class="indexPage">
    <p>index</p>
    <div><button @click="btn">按钮</button></div>
    <ul class="list">
      <li v-for="n in list" :key="n.id">
        <p>{{n.title}}</p>
        <p>{{n.time}}</p>
        <p>{{n.location}}</p>
        <p>{{n.content}}</p>
      </li>
    </ul>
  </div>
</template>

<script>
import { list } from '@/components'
import { index as indexApi } from '@/api';

export default {
  name: 'index',
  components: {
    list
  },
  computed: {
    isLogin() {
      return this.$store.state.user.isLogin
    },
  },
  data() {
    return {
      list: []
    }
  },
  created(){
    this.init();
  },
  methods: {
    init(){
      indexApi().then(res => {
        this.list = res.data.list;
      })
    },
    btn(){
      this.$store.dispatch('user/login', this.loginForm).then( () => {
        console.log(this.isLogin)
      })
    }
  }
}
</script>

<style lang="scss" scoped>
.list {
  li {
    padding: 20px;
  }
}
</style>

